.mui-datetimerangepicker {
  display: block;
  border: solid 1px #e5e5e5;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 4px 16px 1px rgba(0, 0, 0, 0.24), 0 0 1px 0 rgba(0, 0, 0, 0.12);

  .mui-calender {
    padding: 0 13px 10px;
  }

  .mui-datetimerangepicker-row {
    display: flex;

    .mui-datetimerangepicker-col {
      flex: 1;
      min-width: 246px;
      &:nth-child(2) {
        border-left: solid 1px #e5e5e5;
      }

      .mui-time {
        display: inline-block;
        vertical-align: middle;

        .mui-forminput {
          width: auto;
          max-width: 80px;
          padding: 4px 6px;
          min-height: 30px;
        }
      }
    }

    dl {
      margin: 0;
      margin-left: 12px;
      dt {
        font-size: 16px;
        line-height: 30px;
      }
      dd {
        margin-left: 24px;
        & > span {
          display: inline-block;
          margin-right: 6px;
          padding-left: 12px;
          font-size: 14px;
          line-height: 30px;
          vertical-align: middle;
        }
      }
    }

    &.partial {
      padding: 6px;
      background-color: #f5f5f5;

      & > .mui-datetimerangepicker-col {
        flex: none;
        width: 50%;
        box-sizing: border-box;
        padding: 0 12px;
        &:nth-child(2) {
          border-left: none;
          padding-left: 19px;
        }

        .ming.Checkbox {
          padding: 5px 0;
        }
      }
    }

    &.toolbar {
      box-sizing: content-box;
      height: 30px;
      padding: 8px 18px;
      text-align: right;
      background-color: #f5f5f5;

      & > .mui-datetimerangepicker-col {
        text-align: right;
        flex: none;
        width: 50%;
        box-sizing: border-box;
        &:nth-child(2) {
          border-left: none;
          padding-left: 18px;
        }

        &:after {
          content: '';
          display: block;
          width: 100%;
          height: 0;
          clear: both;
        }

        & > .label {
          display: inline-block;
          font-size: 13px;
          line-height: 30px;
          vertical-align: middle;
          margin-right: 8px;
        }

        & > .label,
        & > .mui-time,
        & > .Dropdown {
          float: left;
        }

        .Menu {
          width: 80px;
          text-align: left;
        }

        & > button {
          font-size: 13px;
          line-height: 20px;
          padding: 5px 6px;
          min-width: 50px;
          vertical-align: middle;
          margin-left: 6px;
          &.Button--ghost {
            padding: 4px 6px;
          }
        }
      }
    }
  }
}
